<template>
  <div class="employeesDetail" v-loading="homeLoading">
    <section class="header clearfix">
      <div class="back">
        <i class="iconfont iconfanhui1" @click="goBack()"></i>
        <span @click="goBack()"
          >{{ $route.query.companyName ? $route.query.companyName + "/" : ""
          }}{{ fullName }}</span
        >
      </div>
    </section>
    <!--入职/离职-->
    <div class="leave clearfix" v-if="auditInfo.auditStatus == '1'">
      <div class="normal" v-if="userDetail.jobStatus == 1">
        <i class="iconfont icontongzhi"></i
        >{{ userDetail.jobFirstTime | dateFilter }}入职转正
      </div>
      <div class="normal" v-else-if="userDetail.jobStatus == 2">
        <i class="iconfont icontongzhi"></i>{{ userDetail.jobFirstTime | dateFilter }}试用
      </div>
      <div class="message" v-else-if="userDetail.jobStatus == 3">
        <i class="iconfont icontongzhi"></i>该员工已离职
      </div>
      <!--操作-->
      <section class="leave-pointer">
        <span class="reset" @click="entryWork(1)" v-if="userDetail.jobStatus == 3">
          <i class="iconfont icontubiaozhizuomoban-97"></i>重新雇佣
        </span>
        <span class="reset" @click="entryWork(2)" v-if="userDetail.jobStatus == 1">
          <i class="iconfont icontubiaozhizuomoban-99"></i>解雇
        </span>
        <span class="reset" @click="entryWork(3)" v-if="userDetail.jobStatus == 2">
          <i class="iconfont icontubiaozhizuomoban-97"></i>转正
        </span>
      </section>
    </div>
    <!--审核信息-->
    <div class="p-t-lg" v-if="auditInfo.auditStatus != '1'">
      <header style="margin-bottom: 20px">
        <div class="title">审核信息</div>
      </header>
      <el-timeline>
        <el-timeline-item
          v-for="(activity, index) in remarkList"
          :key="index"
          :timestamp="activity.time"
        >
          {{ activity.remark }}
        </el-timeline-item>
      </el-timeline>
    </div>

    <!--基本信息-->
    <div class="p-t-lg">
      <header>
        <div class="title">基本信息</div>
      </header>
      <div class="main clearfix">
        <section>
          <span>
            姓名
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-input
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="在这里输入姓名"
              v-model.trim="userDetail.fullName"
              clearable
            ></el-input>
          </span>
        </section>
        <section>
          <span>
            身份证
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-input
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="在这里输入身份证"
              v-model.trim="userDetail.idCard"
              maxlength="18"
              @change="idCardChange"
              clearable
            ></el-input>
          </span>
        </section>
        <section>
          <span>民族 <i class="warn">*</i></span>
          <span class="value">
            <el-select
              v-model.trim="userDetail.nation"
              filterable
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="请选择"
            >
              <el-option
                v-for="(item, index) in nationOptions"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </span>
        </section>
        <section>
          <span>性别 <i class="warn">*</i></span>
          <span class="value">
            <el-select
              v-model.trim="userDetail.sex"
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="请选择"
            >
              <el-option
                v-for="item in sexOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </span>
        </section>
        <section>
          <span>
            手机号
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-input
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="在这里输入手机号"
              v-model.trim="userDetail.phone"
              maxlength="11"
              clearable
            ></el-input>
          </span>
        </section>
        <section>
          <span class="title">
            户籍类型
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-select
              :disabled="auditInfo.auditStatus == '1'"
              v-model="userDetail.censusRegisterType"
              placeholder="请选择"
            >
              <el-option
                v-for="item in censusOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </span>
        </section>
        <section>
          <span class="title">
            参保身份
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-select
              :disabled="auditInfo.auditStatus == '1'"
              v-model="userDetail.insuredStatus"
              filterable
              placeholder="请选择"
            >
              <el-option
                v-for="(item, index) in insuredStatusOptions"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </span>
        </section>
        <section>
          <span class="title">
            职工工种
            <i class="warn"></i>
          </span>
          <span class="value">
            <el-select
              v-model="userDetail.typeOfWork"
              filterable
              :disabled="auditInfo.auditStatus == '1'"
              placeholder="请选择"
            >
              <el-option
                v-for="(item, index) in typeOfWorkOptions"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </span>
        </section>

        <section>
          <span>
            户籍地址
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-input
              placeholder="户口所在地的地址"
              v-model.trim="userDetail.permanentAddress"
              :disabled="auditInfo.auditStatus == '1'"
              clearable
            ></el-input>
          </span>
        </section>
        <section>
          <span> 最高学历</span>
          <span class="value">
            <el-select
              v-model.trim="userDetail.education"
              :disabled="auditInfo.auditStatus == '1'"
              filterable
              placeholder="请选择"
            >
              <el-option
                v-for="item in educationOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </span>
        </section>
        <section>
          <span>
            联系地址
            <i class="warn">*</i>
          </span>
          <span class="value">
            <el-input
              placeholder="在这里输入联系地址"
              v-model.trim="userDetail.address"
              :disabled="auditInfo.auditStatus == '1'"
              clearable
            ></el-input>
          </span>
        </section>
        <section>
          <span> 工资 </span>
          <span class="value">
            <el-input
              placeholder="在这里输入工资"
              v-model.trim="userDetail.wage"
              clearable
              :disabled="auditInfo.auditStatus == '1'"
              ><template slot="append">元</template></el-input
            >
          </span>
        </section>
      </div>
    </div>
    <!--社保/公积金-->
    <div class="p-t-lg">
      <header class="clearfix">
        <div class="title">社保/公积金</div>
        <div
          class="is-open"
          v-if="userDetail.jobStatus != 3 && auditInfo.auditStatus != 0"
        >
          <el-switch v-model="isEdit" active-text="开启编辑" inactive-text="关闭编辑">
          </el-switch>
        </div>
      </header>
      <div class="main clearfix">
        <div class="box">
          <section>
            <span class="title">
              缴纳项目
              <i class="warn">*</i>
            </span>
            <span class="value">
              <el-checkbox
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="isPaySocialSecurity"
                @change="changeType"
                >社保</el-checkbox
              >
              <el-checkbox
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="isPayFund"
                @change="changeType"
                >公积金</el-checkbox
              >
            </span>
          </section>
        </div>
        <div class="input-box">
          <section>
            <span class="title"> 当地社保 </span>
            <span class="value">
              <el-select
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="userDetail.isLocalSocialSecurity"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in isLocalSocialSecurityOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </span>
          </section>
        </div>
        <div class="input-box">
          <section>
            <span class="title">
              缴纳城市
              <i class="warn">*</i>
            </span>
            <span class="value">
              <el-select
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="userDetail.areaCode"
                @change="getPlatform"
                placeholder="请选择"
                filterable
              >
                <el-option
                  v-for="item in cityOptions"
                  :key="item.areaCode"
                  :label="item.areaName"
                  :value="item.areaCode"
                >
                </el-option>
              </el-select>
            </span>
          </section>
        </div>
        <div class="input-box">
          <section>
            <span class="title">
              缴纳平台
              <i class="warn">*</i>
            </span>
            <span class="value">
              <el-select
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="userDetail.pId"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in platformOptions"
                  :key="item.platformId"
                  :label="item.platformName"
                  :value="item.platformId"
                ></el-option>
              </el-select>
            </span>
          </section>
        </div>
        <div class="input-box" v-show="isPaySocialSecurity">
          <section>
            <span class="title">社保账号</span>
            <span class="value">
              <el-input
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请填写"
                v-model.trim="userDetail.socialSecurityAccount"
              ></el-input>
            </span>
          </section>
        </div>
        <div class="input-box" v-show="isPaySocialSecurity">
          <section>
            <span class="title">社保基数 <i class="warn">*</i></span>
            <span class="value">
              <el-input
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请填写"
                v-model.trim="userDetail.socialSecurityBasic"
                @blur="getPaymentAmount"
              ></el-input>
            </span>
          </section>
          <div
            class="data-range"
            v-if="socialSecurityBasicValMin && socialSecurityBasicValMax"
          >
            取值范围：{{ socialSecurityBasicValMin }}~{{ socialSecurityBasicValMax }}
          </div>
        </div>
        <div class="input-box" v-show="isPaySocialSecurity">
          <section>
            <span class="title"> 社保起缴月份 <i class="warn">*</i></span>
            <span class="value">
              <el-date-picker
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="userDetail.socialSecurityDate"
                type="month"
                @change="socialMonthChange"
                format="yyyy 年 MM 月"
                value-format="yyyy-MM"
                placeholder="选择月份"
                :picker-options="pickerOptions"
              ></el-date-picker>
            </span>
          </section>
        </div>
        <div class="input-box" v-show="isPayFund">
          <section>
            <span class="title">公积金账号</span>
            <span class="value">
              <el-input
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请填写"
                v-model.trim="userDetail.fundAccount"
              ></el-input>
            </span>
          </section>
        </div>
        <div class="input-box" v-show="isPayFund">
          <section>
            <span class="title">公积金基数 <i class="warn">*</i></span>
            <span class="value">
              <el-input
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请填写"
                v-model.trim="userDetail.fundBasic"
                @blur="getPaymentAmount"
              ></el-input>
            </span>
          </section>
          <div class="data-range" v-if="fundBasicValMin > 0 && fundBasicValMax > 0">
            取值范围：{{ fundBasicValMin }}~{{ fundBasicValMax }}
          </div>
        </div>
        <div class="input-box" v-show="isPayFund">
          <section>
            <span class="title"> 公积金起缴月份 <i class="warn">*</i></span>
            <span class="value">
              <el-date-picker
                :disabled="userDetail.jobStatus == 3 || !isEdit"
                v-model="userDetail.fundDate"
                type="month"
                format="yyyy 年 MM 月"
                value-format="yyyy-MM"
                placeholder="选择月份"
                :picker-options="fundPickerOptions"
              ></el-date-picker>
            </span>
          </section>
        </div>
      </div>
    </div>
    <!--基数表格-->
    <div class="p-t-lg">
      <header>
        <div class="title">基数列表</div>
        <div
          class="edit"
          v-if="userDetail.jobStatus != 3 && auditInfo.auditStatus != 0 && isEdit"
          @click="addBasic()"
        >
          <!--未离职、已审核才能新增项目-->
          <i class="iconfont iconadd1"></i>&nbsp;新增
        </div>
      </header>
      <div class="table">
        <el-table
          show-summary
          :summary-method="getSummaries"
          :data="basicInfoTable"
          border
          tooltip-effect="dark"
          v-loading="loading"
          style="width: 100%"
        >
          <el-table-column width="80" prop="paymentId" label="ID"></el-table-column>
          <el-table-column prop="paymentName" label="项目名称"></el-table-column>
          <el-table-column
            prop="paymentItemType"
            label="项目类别"
            :formatter="paymentTypeIdFilter"
          ></el-table-column>
          <el-table-column
            width="80"
            prop="paymentType"
            label="缴纳方式"
            :formatter="typeFilter"
          ></el-table-column>
          <el-table-column label="基数">
            <template slot-scope="scope">
              {{
                scope.row.paymentType == 1
                  ? scope.row.basic
                  : scope.row.defaultVal | baseFilter
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="defaultVal"
            label="默认值"
            :formatter="defaultValFormatter"
          ></el-table-column>
          <el-table-column label="公司比例" prop="companyVal" :formatter="valueFormatter">
          </el-table-column>
          <el-table-column
            label="公司金额"
            prop="companyAmount"
            :formatter="signFormatter"
          >
          </el-table-column>
          <el-table-column label="个人比例" prop="personVal" :formatter="valueFormatter">
          </el-table-column>
          <el-table-column
            label="个人金额"
            prop="personAmount"
            :formatter="signFormatter"
          >
          </el-table-column>
          <el-table-column
            label="操作"
            width="150"
            v-if="userDetail.jobStatus != 3 && isEdit"
          >
            <template slot-scope="scope">
              <!--离职、社保、公积金不能编辑-->
              <el-button
                :disabled="
                  userDetail.jobStatus == 3 ||
                  scope.row.paymentItemType == 1 ||
                  scope.row.paymentItemType == 2
                "
                size="mini"
                @click="onEdit(scope.row)"
                >编辑</el-button
              >
              <el-button
                type="danger"
                size="mini"
                :disabled="userDetail.jobStatus == 3"
                @click="onDelete(scope.row, scope.$index)"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <!--证件照片/扫描件-->
    <div class="p-t-lg">
      <header class="clearfix">
        <div class="title">证件照片/扫描件</div>
      </header>
      <div class="main">
        <div class="clearfix">
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading2" @click="showImg(0)">
              <el-image
                v-if="userDetail.idCardFrontPhotoPath"
                style="width: 100%; height: 100%"
                :src="userDetail.idCardFrontPhotoPath"
                :preview-src-list="srcList"
              ></el-image>
            </div>
            <p>身份证正面照片(头像面)</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 2)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading3" @click="showImg(1)">
              <el-image
                v-if="userDetail.idCardBackPhotoPath"
                style="width: 100%; height: 100%"
                :src="userDetail.idCardBackPhotoPath"
                :preview-src-list="srcList"
              ></el-image>
            </div>
            <p>身份证反面照片(国徽面)</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 3)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading4" @click="showImg(2)">
              <el-image
                v-if="userDetail.residenceBookMainPath"
                style="width: 100%; height: 100%"
                :src="userDetail.residenceBookMainPath"
                :preview-src-list="srcList"
              ></el-image>
            </div>
            <p>户口本主页</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 4)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading5" @click="showImg(3)">
              <el-image
                v-if="userDetail.residenceBookPersonalPath"
                style="width: 100%; height: 100%"
                :src="userDetail.residenceBookPersonalPath"
                :preview-src-list="srcList"
              ></el-image>
            </div>
            <p>户口本个人页</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 5)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-head" v-loading="isLoading1" @click="showImg(4)">
              <el-image
                v-if="userDetail.personPhotoPath"
                style="width: 100%; height: 100%"
                :src="userDetail.personPhotoPath"
                :preview-src-list="srcList"
              ></el-image>
            </div>
            <p>二寸白底免冠照</p>
            <ul class="tip-head">
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 1)" />
              </li>
            </ul>
          </div>
        </div>
        <ul class="explain">
          <li>说明</li>
          <li>1.照片中证件不可以被遮挡，需清晰看到文字信息</li>
          <li>2.照片中证件需为原件，请勿上传复印件照片</li>
          <li>3.仅支持jpg, jpeg, png格式的图片</li>
        </ul>
      </div>
    </div>
    <div class="button-box">
      <el-button @click="goBack()">返回</el-button>
      <!--未通过审核-新增-->
      <!-- <el-button
        type="primary"
        v-if="auditInfo.auditStatus == '2' && userDetail.jobStatus != 3"
        :loading="submitLoading"
        @click="reSubmit()"
      >
        重新提交
      </el-button> -->
      <!--其他-->
      <el-button
        type="primary"
        v-if="userDetail.jobStatus != 3 && auditInfo.auditStatus != 0 && isEdit"
        :loading="submitLoading"
        @click="submit()"
      >
        保存
      </el-button>
    </div>

    <!--新增对话框-->
    <el-dialog
      title="新增缴纳项目"
      :visible.sync="dialogFormVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      center
      width="600px"
    >
      <el-form :model="form">
        <el-form-item label="项目类别" :label-width="formLabelWidth">
          <el-select
            v-model="form.companyPaymentId"
            @change="paymentChange"
            placeholder="请选择"
          >
            <el-option
              v-for="item in itemClassification"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmAdd()">确 定</el-button>
      </div>
    </el-dialog>

    <!--修改对话框-->
    <el-dialog
      title="编辑缴纳项目"
      :visible.sync="dialogEdit"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      width="600px"
      center
    >
      <el-form :model="form">
        <el-form-item label="缴纳项目" :label-width="formLabelWidth">
          <el-select v-model="form.companyPaymentId" disabled placeholder="请选择">
            <el-option
              v-for="item in areaPaymentOptions"
              :key="item.companyPaymentId"
              :label="item.paymentName"
              :value="item.companyPaymentId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="缴纳方式" :label-width="formLabelWidth">
          <el-select
            v-model="form.paymentType"
            @change="typeChange"
            disabled
            placeholder="请选择"
          >
            <el-option
              v-for="item in paymentTypeOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          v-if="form.paymentType == 0"
          label="默认值"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="form.defaultVal"
            disabled
            placeholder="请输入默认值"
            autocomplete="off"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="基数"
          v-if="form.paymentType == 1"
          :label-width="formLabelWidth"
        >
          <el-input v-model="form.basic" clearable placeholder="请输入基数"
            ><template slot="append">元</template></el-input
          >
        </el-form-item>
        <p class="tip" v-if="form.paymentType == 1">
          提示：基数取值范围必须在{{ form.baseValMin }}~{{ form.baseValMax }}之间
        </p>
        <el-form-item
          label="公司比例"
          v-if="form.paymentType == 1"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="form.companyVal"
            suffix-icon="iconfont iconbaifenbi"
            placeholder="请输入公司比例"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item
          label="个人比例"
          v-if="form.paymentType == 1"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="form.personVal"
            suffix-icon="iconfont iconbaifenbi"
            placeholder="请输入个人比例"
            disabled
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogEdit = false">取 消</el-button>
        <el-button type="primary" @click="confirmUpdate()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import base from "@/assets/js/base";
import commonData from "@/assets/js/commonData";
import { requestApiPost, requestApiFilePost } from "../api/api";
import { reqRep } from "../report/reqReport";
import { resRep } from "../report/resReport";
export default {
  name: "employeesDetail",
  data() {
    return {
      remarkList: [],
      //设置日期组件
      pickerOptions: {
        // disabledDate(time) {
        //   //获取上个月的毫秒数
        //   let date = new Date();
        //   let pDate = new Date(
        //     date.getFullYear(),
        //     date.getMonth() - 1,
        //     date.getDate()
        //   ).getTime();
        //   return time.getTime() > Date.now() || time.getTime() < pDate;
        // },
        disabledDate(time) {
          //获取下个月的毫秒数
          let date = new Date();
          let nDate = new Date(
            date.getFullYear(),
            date.getMonth() + 1,
            date.getDate()
          ).getTime();
          return time.getTime() > nDate;
        },
      },
      fundPickerOptions: {
        // disabledDate(time) {
        //   //获取上个月的毫秒数
        //   let date = new Date();
        //   let pDate = new Date(date.getFullYear(), 1, 0).getTime();
        //   let nDate = new Date(date.getFullYear() + 1, 0, 0).getTime();
        //   return time.getTime() < pDate || time.getTime() > nDate;
        // },
        disabledDate(time) {
          //获取下个月的毫秒数
          let date = new Date();
          let nDate = new Date(
            date.getFullYear(),
            date.getMonth() + 1,
            date.getDate()
          ).getTime();
          return time.getTime() > nDate;
        },
      },
      isEdit: false, //是否可编辑
      fullName: "",
      dialogEdit: false,
      dialogFormVisible: false,
      homeLoading: false,
      loading: false,
      submitLoading: false,
      isLoading5: false,
      isLoading1: false,
      isLoading2: false,
      isLoading3: false,
      isLoading4: false,
      updateLoading: false,
      addLoading: false,
      infoDialog: false,
      auditInfo: {},
      userDetail: {
        socialSecurityBasic: 0,
        fundBasic: 0,
      },
      areaPaymentOptions: [],
      formLabelWidth: "160px",
      form: {},
      srcList: [],
      imgList: [],
      platformOptions: [],
      isLocalSocialSecurityOptions: [
        {
          value: 0,
          label: "交过",
        },
        {
          value: 1,
          label: "未交过",
        },
      ],
      sexOptions: [
        {
          value: 1,
          label: "男",
        },
        {
          value: 2,
          label: "女",
        },
      ],
      isPayFund: true,
      isPaySocialSecurity: true,
      cityOptions: [],
      paymentTypeOptions: [
        {
          value: "0",
          label: "值",
        },
        {
          value: "1",
          label: "比例",
        },
      ],
      censusOptions: [],
      paymentOptions: [
        {
          value: "1",
          label: "各缴",
        },
        {
          value: "2",
          label: "公司全缴",
        },
      ],
      educationOptions: [],
      basicInfoTable: [], //缴纳基数列表
      inOrOut: "",
      itemClassification: [],
      socialSecurityBasicValMax: "",
      socialSecurityBasicValMin: "",
      fundBasicValMax: "",
      fundBasicValMin: "",
      insuredStatusOptions: [],
      typeOfWorkOptions: [],
      nationOptions: [],
    };
  },
  methods: {
    //根据身份证获取性别
    idCardChange(idCard) {
      if (base.isCardId(idCard)) {
        let sex = base.getSexByIdCard(idCard);
        this.$set(this.userDetail, "sex", sex);
      }
    },
    //处理合计
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }

        if (column.property == "companyAmount" || column.property == "personAmount") {
          const values = data.map((item) => Number(item[column.property]));
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return base.accAdd(prev, curr);
            } else {
              return prev;
            }
          }, 0);
          sums[index] += " 元";
        }
      });

      return sums;
    },
    //确认新增缴纳项目
    confirmAdd() {
      if (this.baseList.length > 0) {
        for (let index = 0; index < this.baseList.length; index++) {
          for (let j = 0; j < this.basicInfoTable.length; j++) {
            if (this.baseList[index].paymentId == this.basicInfoTable[j].paymentId) {
              this.$message.warning("缴纳项目重复，请重新选择");
              return;
            }
          }
          this.baseList[index].type = "add";
        }

        this.addLoading = true;

        this.basicInfoTable = [...this.basicInfoTable, ...this.baseList];

        this.basicInfoTable = this.basicInfoTable
          .filter((e) => {
            if (!this.isPaySocialSecurity) {
              return e.paymentItemType != "1";
            } else {
              return e;
            }
          })
          .filter((e) => {
            if (!this.isPayFund) {
              return e.paymentItemType != "2";
            } else {
              return e;
            }
          });

        for (let index = 0; index < this.baseList.length; index++) {
          //社保赋值
          if (this.baseList[index].paymentItemType == "1") {
            if (this.baseList[index].paymentType === "1") {
              //没有社保基数直接赋值
              if (!this.userDetail.socialSecurityBasic) {
                this.$set(
                  this.userDetail,
                  "socialSecurityBasic",
                  this.baseList[index].basic
                );
              }
            }
            if (this.baseList[index].paymentType === "0") {
              if (!this.userDetail.socialSecurityBasic) {
                this.$set(
                  this.userDetail,
                  "socialSecurityBasic",
                  this.baseList[index].defaultVal
                );
              }
            }
            //社保范围
            this.socialSecurityBasicValMax = this.baseList[index].baseValMax || 0;
            this.socialSecurityBasicValMin = this.baseList[index].baseValMin || 0;
          }

          //公积金赋值
          if (this.baseList[index].paymentItemType == "2") {
            if (this.baseList[index].paymentType === "1") {
              if (!this.userDetail.fundBasic) {
                this.$set(this.userDetail, "fundBasic", this.baseList[index].basic);
              }
            }
            if (this.baseList[index].paymentType === "0") {
              if (!this.userDetail.fundBasic) {
                this.$set(this.userDetail, "fundBasic", this.baseList[index].defaultVal);
              }
            }

            //公积金范围
            this.fundBasicValMax = this.baseList[index].baseValMax || 0;
            this.fundBasicValMin = this.baseList[index].baseValMin || 0;
          }
        }

        this.dialogFormVisible = false;
        this.getPaymentAmount();
      } else {
        this.$message.warning("该项目类别没有缴纳项目");
      }
    },
    //确认修改缴纳项目
    confirmUpdate() {
      if (!this.form.paymentType || !this.form.companyPaymentId) {
        this.$message.warning("信息不完整");
        return;
      }
      if (this.form.paymentType == 0) {
        if (!this.form.defaultVal) {
          this.$message.warning("请输入默认值");
          return;
        }
      } else {
        if (!this.form.basic || !this.form.companyVal || !this.form.personVal) {
          this.$message.warning("请输入比例");
          return;
        }
        if (
          Number(this.form.basic) < Number(this.form.baseValMin) ||
          Number(this.form.basic) > Number(this.form.baseValMax)
        ) {
          this.$message.warning("基数错误，请输入范围中的值");
          return;
        }
      }
      let data = JSON.parse(JSON.stringify(this.form));

      if (!data.type || data.type != "add") {
        data.type = "edit";
      }

      let index = this.basicInfoTable.findIndex((e) => {
        return e.paymentId == data.paymentId;
      });

      this.basicInfoTable.splice(index, 1, data);
      this.dialogEdit = false;
      this.getPaymentAmount();
    },

    //修改社保起缴月份
    socialMonthChange() {},
    typeFilter(a, b, c) {
      if (c == 1) {
        return "比例";
      } else {
        return "值";
      }
    },
    defaultValFormatter(a, b, c) {
      if (c > 0) {
        return c;
      } else {
        return "-";
      }
    },

    //选择缴纳方式
    typeChange(e) {
      if (e == 0) {
        this.form.basic = "";
        this.form.companyVal = "";
        this.form.personVal = "";
      } else {
        this.form.defaultVal = "";
      }
    },
    //重新雇佣
    entryWork(inOrOut) {
      let personIds = [this.$route.query.personId];
      var reqData = {
        personIds: personIds,
        companyId:
          this.$route.query.companyId ||
          JSON.parse(sessionStorage.getItem("login")).personId,
        inOrOut: inOrOut, // 1入职；2离职；3转正
      };
      let reqReport = reqRep({
        traCode: "_IN_OUT_JOB",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "操作成功",
            type: "success",
          });
          setTimeout(() => {
            this.goBack();
          }, 1000);
        }
      });
    },
    //展示指定图片
    showImg(i) {
      this.srcList = [];
      this.srcList.push(this.imgList[i]);
    },
    goBack() {
      this.$router.go(-1);
    },

    //编辑缴纳项目
    onEdit(info) {
      this.form = JSON.parse(JSON.stringify(info));
      this.dialogEdit = true;
    },

    //新增基数
    addBasic() {
      //离职不能操作
      if (this.userDetail.jobStatus == 3) {
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      this.$set(this.form, "basic", "");
      this.$set(this.form, "companyVal", "");
      this.$set(this.form, "defaultVal", "");
      this.$set(this.form, "paymentType", "");
      this.$set(this.form, "paymentName", "");
      this.$set(this.form, "paymentId", "");
      this.$set(this.form, "personVal", "");
      this.$set(this.form, "companyPaymentId", "");
      this.dialogFormVisible = true;
    },
    //选择项目类别
    paymentChange(e) {
      let data = this.areaPaymentOptions.filter((a) => {
        return a.paymentItemType == e;
      });
      if (data.length > 0) {
        for (let index = 0; index < data.length; index++) {
          data[index].paymentTypeId = data[index].paymentItemType;
        }

        this.baseList = data;
      } else {
        this.$message.warning("暂无对应缴纳项目，请先添加");
        return;
      }
    },

    //获取缴纳项目比例的金额
    getPaymentAmount() {
      if (this.basicInfoTable.length > 0) {
        //paymentType==1 比例
        //paymentItemType==1 社保 paymentItemType==2 公积金
        //userDetail.socialSecurityBasic 社保基数 userDetail.fundBasic 公积金基数
        for (let index = 0; index < this.basicInfoTable.length; index++) {
          //比例
          if (this.basicInfoTable[index].paymentType == 1) {
            //社保/公积金
            if (
              this.basicInfoTable[index].paymentItemType == 1 ||
              this.basicInfoTable[index].paymentItemType == 2
            ) {
              //基数
              let baseVal = 0;

              let companyVal =
                base.accDiv(this.basicInfoTable[index].companyVal, 100) || 0;

              let personVal = base.accDiv(this.basicInfoTable[index].personVal, 100) || 0;
              //社保
              if (this.basicInfoTable[index].paymentItemType == 1) {
                baseVal = this.userDetail.socialSecurityBasic || 0;
              } else if (this.basicInfoTable[index].paymentItemType == 2) {
                //公积金
                baseVal = this.userDetail.fundBasic || 0;
              }

              let companyAmount = base.accMul(baseVal, companyVal);
              let personAmount = base.accMul(baseVal, personVal);

              if (this.basicInfoTable[index].paymentItemType == 2) {
                //公积金四舍五入取整
                companyAmount = Number(companyAmount.toFixed(0));
                personAmount = Number(personAmount.toFixed(0));
              } else if (this.basicInfoTable[index].paymentItemType == 1) {
                //社保四舍五入保留2位小数
                companyAmount = Number(companyAmount.toFixed(2));
                personAmount = Number(personAmount.toFixed(2));
              }

              //修改表格基数
              this.$set(this.basicInfoTable[index], "basic", baseVal);
              this.$set(this.basicInfoTable[index], "companyAmount", companyAmount);
              this.$set(this.basicInfoTable[index], "personAmount", personAmount);
            } else {
              //其他项目
              if (this.basicInfoTable[index].paymentType == 1) {
                //基数
                let baseVal = this.basicInfoTable[index].basic || 0;

                let companyVal =
                  base.accDiv(this.basicInfoTable[index].companyVal, 100) || 0;
                let personVal =
                  base.accDiv(this.basicInfoTable[index].personVal, 100) || 0;

                let companyAmount = base.accMul(baseVal, companyVal) || 0;
                let personAmount = base.accMul(baseVal, personVal) || 0;
                //四舍五入保留2位小数
                companyAmount = Number(companyAmount.toFixed(2));
                personAmount = Number(personAmount.toFixed(2));

                this.$set(this.basicInfoTable[index], "companyAmount", companyAmount);
                this.$set(this.basicInfoTable[index], "personAmount", personAmount);
              } else {
                this.$set(this.basicInfoTable[index], "companyAmount", 0);
                this.$set(this.basicInfoTable[index], "personAmount", 0);
              }
            }
          } else {
            //值
            this.$set(this.basicInfoTable[index], "companyAmount", 0);
            this.$set(this.basicInfoTable[index], "personAmount", 0);
          }
        }
      }
    },
    //获取详情
    getData() {
      var reqData = {
        personId: this.$route.query.personId,
      };
      let reqReport = reqRep({ traCode: "_GET_PERSON", data: reqData });
      requestApiPost(reqReport).then((data) => {
        this.homeLoading = false;
        this.loading = false;
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.userDetail = JSON.parse(JSON.stringify(resReport.data));

          this.getPlatform();
          //工资
          this.$set(this.userDetail, "wage", this.userDetail.basicWages);

          //已有的缴纳项目列表
          this.basicInfoTable = this.userDetail.basicInfo || [];
          this.baseList = this.basicInfoTable;

          //筛选出社保、公积金的取值范围
          for (let index = 0; index < this.basicInfoTable.length; index++) {
            //社保基数赋值
            if (this.basicInfoTable[index].paymentItemType == 1) {
              this.socialSecurityBasicValMax = this.basicInfoTable[index].baseValMax || 0;
              this.socialSecurityBasicValMin = this.basicInfoTable[index].baseValMin || 0;
            }

            //公积金基数赋值
            if (this.basicInfoTable[index].paymentItemType == 2) {
              this.fundBasicValMax = this.basicInfoTable[index].baseValMax || 0;
              this.fundBasicValMin = this.basicInfoTable[index].baseValMin || 0;
            }
          }

          this.getPaymentAmount();

          //赋值基础信息
          this.fullName = this.userDetail.fullName;
          this.isPayFund = this.userDetail.isPayFund == 1 ? true : false;
          this.isPaySocialSecurity =
            this.userDetail.isPaySocialSecurity == 1 ? true : false;
          this.imgList = [
            this.userDetail.idCardFrontPhotoPath,
            this.userDetail.idCardBackPhotoPath,
            this.userDetail.residenceBookMainPath,
            this.userDetail.residenceBookPersonalPath,
            this.userDetail.personPhotoPath,
          ];
        }
      });
    },
    //获取缴纳城市
    getCity() {
      var reqData = {
        grade: 1,
        isStart: 0,
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({ traCode: "_LIST_AREA", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.cityOptions = resReport.data.records;
        }
      });
    },
    //获取平台
    getPlatform() {
      var reqData = {
        PName: "",
        areaCode: this.userDetail.areaCode ? this.userDetail.areaCode : "",
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({ traCode: "_LIST_PAY_PLATFORM", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.platformOptions = resReport.data.records;
        }
      });
      this.getAreaPayment();
    },
    //上传
    upImg(e, type) {
      let that = this;
      switch (type) {
        case 1:
          this.isLoading1 = true;
          break;
        case 2:
          this.isLoading2 = true;
          break;
        case 3:
          this.isLoading3 = true;
          break;
        case 4:
          this.isLoading4 = true;
          break;
        case 5:
          this.isLoading5 = true;
          break;
      }
      requestApiFilePost(e.target.files[0]).then((data) => {
        e.target.value = "";
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          switch (type) {
            case 1:
              this.isLoading1 = false;
              break;
            case 2:
              this.isLoading2 = false;
              break;
            case 3:
              this.isLoading3 = false;
              break;
            case 4:
              this.isLoading4 = false;
              break;
            case 5:
              this.isLoading5 = false;
              break;
          }
          if (type == 1) {
            that.$set(
              that.userDetail,
              "personPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "personPhotoId", resReport.data.fileId);
          } else if (type == 2) {
            that.$set(
              that.userDetail,
              "idCardFrontPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "idCardFrontPhotoId", resReport.data.fileId);
          } else if (type == 3) {
            that.$set(
              that.userDetail,
              "idCardBackPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "idCardBackPhotoId", resReport.data.fileId);
          } else if (type == 4) {
            that.$set(
              that.userDetail,
              "residenceBookMainPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "residenceBookMainId", resReport.data.fileId);
          } else if (type == 5) {
            that.$set(
              that.userDetail,
              "residenceBookPersonalPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "residenceBookPersonalId", resReport.data.fileId);
          }
          this.imgList = [
            that.userDetail.idCardFrontPhotoPath,
            that.userDetail.idCardBackPhotoPath,
            that.userDetail.residenceBookMainPath,
            that.userDetail.residenceBookPersonalPath,
            that.userDetail.personPhotoPath,
          ];
        }
      });
    },
    //重新提交
    reSubmit() {
      if (!this.userDetail.fullName) {
        this.$message.warning("请输入姓名");
        return;
      }
      if (!this.userDetail.nation) {
        this.$message.warning("请选择民族");
        return;
      }
      if (!base.isCardId(this.userDetail.idCard)) {
        this.$message.warning("身份证号码格式不正确");
        return;
      }
      if (!base.isPoneAvailable(this.userDetail.phone)) {
        this.$message.warning("手机号码格式不正确");
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (this.basicInfoTable.length <= 0) {
        this.$message.warning("请添加缴纳项目");
        return;
      }
      if (!this.userDetail.pId) {
        this.$message.warning("请选择缴纳平台");
        return;
      }

      if (
        this.isPaySocialSecurity &&
        (parseFloat(this.userDetail.socialSecurityBasic) <
          parseFloat(this.socialSecurityBasicValMin) ||
          parseFloat(this.userDetail.socialSecurityBasic) >
            parseFloat(this.socialSecurityBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的社保基数");
        return;
      }

      if (this.isPaySocialSecurity && !this.userDetail.socialSecurityDate) {
        this.$message.warning("请选择社保起缴月份");
        return;
      }
      if (
        this.isPayFund &&
        (parseFloat(this.userDetail.fundBasic) < parseFloat(this.fundBasicValMin) ||
          parseFloat(this.userDetail.fundBasic) > parseFloat(this.fundBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的公积金基数");
        return;
      }

      if (this.isPayFund && !this.userDetail.fundDate) {
        this.$message.warning("请选择公积金起缴月份");
        return;
      }

      var reqData = this.userDetail;
      reqData.PId = this.userDetail.pId;
      reqData.paymentMethod = "2"; //公司全缴
      reqData.basicInfo = this.basicInfoTable;
      reqData.isPayFund = this.isPayFund ? 1 : 2;
      reqData.isPaySocialSecurity = this.isPaySocialSecurity ? 1 : 2;
      reqData.isJobFirst = 0; //0入职；1不入职
      let reqReport = reqRep({ traCode: "_ADD_PERSON_IN_JOB", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.goBack();
        }
      });
    },
    //获取企业区域缴纳项目
    getAreaPayment() {
      var reqData = {
        companyId:
          this.$route.query.companyId ||
          JSON.parse(sessionStorage.getItem("login")).personId,
        areaPaymentId: "",
        areaCode: this.userDetail.areaCode ? this.userDetail.areaCode : "",
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({
        traCode: "_LIST_COMPANY_PAYMENT",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.areaPaymentOptions = resReport.data.records || [];

          /**直接赋值给表格 */
          for (let index = 0; index < this.areaPaymentOptions.length; index++) {
            this.areaPaymentOptions[index].paymentTypeId = this.areaPaymentOptions[
              index
            ].paymentItemType;
          }

          if (this.isEdit) {
            this.baseList = this.areaPaymentOptions;
            this.changeType();
          } else {
            //当前城市下的缴纳项目
            this.fullList = this.areaPaymentOptions;
          }
        }
      });
    },
    //修改类型
    changeType() {
      if (this.isEdit) {
        this.basicInfoTable = [];
        this.confirmAdd();
      }
    },
    //新增员工缴纳项目请求
    addPersonPayment(info) {
      info.mappingId = this.$route.query.mappingId;
      let reqReport = reqRep({
        traCode: "_ADD_PERSON_PAYMENT",
        data: info,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },

    //修改员工缴纳项目请求
    editPersonPayment(data) {
      this.updateLoading = true;
      let reqReport = reqRep({
        traCode: "_EDIT_PERSON_PAYMENT",
        data: data,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },
    //删除员工缴纳项目
    onDelete(item, i) {
      if (!item.type || item.type != "add") {
        let isHave = this.deletePaymentList.some((e) => {
          return e.paymentId == item.paymentId;
        });
        if (!isHave) {
          this.deletePaymentList.push(item);
        }
      }
      this.basicInfoTable.splice(i, 1);
    },
    //删除员工缴纳项目请求
    removePersonPayment(mappingPaymentId) {
      let reqReport = reqRep({
        traCode: "_DEL_PERSON_PAYMENT",
        data: {
          mappingPaymentId: mappingPaymentId,
        },
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },
    //修改信息
    submit() {
      if (!this.userDetail.fullName) {
        this.$message.warning("请输入姓名");
        return;
      }
      if (!this.userDetail.nation) {
        this.$message.warning("请选择民族");
        return;
      }
      if (!base.isCardId(this.userDetail.idCard)) {
        this.$message.warning("身份证号码格式不正确");
        return;
      }
      if (!base.isPoneAvailable(this.userDetail.phone)) {
        this.$message.warning("手机号码格式不正确");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (!this.userDetail.insuredStatus) {
        this.$message.warning("请选择参保身份");
        return;
      }
      if (!this.userDetail.permanentAddress) {
        this.$message.warning("请输入户籍地址");
        return;
      }
      if (!this.userDetail.address) {
        this.$message.warning("请输入联系地址");
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (
        this.isPaySocialSecurity &&
        (parseFloat(this.userDetail.socialSecurityBasic) <
          parseFloat(this.socialSecurityBasicValMin) ||
          parseFloat(this.userDetail.socialSecurityBasic) >
            parseFloat(this.socialSecurityBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的社保基数");
        return;
      }

      if (this.isPaySocialSecurity && !this.userDetail.socialSecurityDate) {
        this.$message.warning("请选择社保起缴月份");
        return;
      }

      if (
        this.isPayFund &&
        (parseFloat(this.userDetail.fundBasic) < parseFloat(this.fundBasicValMin) ||
          parseFloat(this.userDetail.fundBasic) > parseFloat(this.fundBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的公积金基数");
        return;
      }

      if (this.isPayFund && !this.userDetail.fundDate) {
        this.$message.warning("请选择公积金起缴月份");
        return;
      }

      this.editInfoRequest();
    },
    /**修改员工信息 */
    editInfoRequest() {
      this.submitLoading = true;
      var reqData = JSON.parse(JSON.stringify(this.userDetail));
      reqData.personId = this.$route.query.personId;
      reqData.mappingId = this.$route.query.mappingId;

      reqData.basicInfo = this.basicInfoTable;

      reqData.isPayFund = this.isPayFund ? 1 : 2;
      reqData.isPaySocialSecurity = this.isPaySocialSecurity ? 1 : 2;

      let reqReport = reqRep({ traCode: "_EDIT_PERSON", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.submitLoading = false;
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "保存成功",
            type: "success",
          });
          this.goBack();
          this.submitLoading = false;
        }
      });
    },
    valueFormatter(a, b, c) {
      if (c > 0) {
        return c + "%";
      } else {
        return "0";
      }
    },
    paymentTypeIdFilter(a, b, c) {
      return this.itemClassification[c].label;
    },
    signFormatter(a, b, c) {
      return c + "元";
    },
  },
  filters: {
    dateFilter(val) {
      if (val) {
        return base.timeSwitch(val);
      }
    },
    monthFilter(val) {
      if (val) {
        return base.monthSwitch(val);
      }
    },
  },
  created() {
    this.insuredStatusOptions = commonData.insuredStatusOptions;
    this.typeOfWorkOptions = commonData.typeOfWorkOptions;
    this.nationOptions = commonData.nationOptions;
    this.educationOptions = commonData.educationOptions;
    this.censusOptions = commonData.censusOptions;
    this.itemClassification = commonData.itemClassification;

    //待删除缴纳项目数组
    this.deletePaymentList = [];

    this.homeLoading = true;
    this.getCity();

    this.getData();

    if (sessionStorage.getItem("auditInfo")) {
      this.auditInfo = JSON.parse(sessionStorage.getItem("auditInfo"));
      if (this.auditInfo.auditStatus != "1") {
        this.remarkList =
          this.auditInfo.auditResult && JSON.parse(this.auditInfo.auditResult);
      } else {
        this.remarkList = [];
      }
    }
  },
};
</script>
<style scoped>
.header {
  padding: 15px;
  height: 50px;
  box-sizing: border-box;
  font-size: 14px;
  border-bottom: 1px solid #eee;
}
.header i {
  margin-right: 5px;
}
.back {
  display: inline-block;
  cursor: pointer;
}
.add {
  float: right;
  color: #666;
  cursor: pointer;
}
.add:hover {
  color: #13cb6e;
}
.input-box .el-input,
.input-box .el-select,
.main .el-input,
.main .el-select {
  width: 228px;
}
.icontongzhi {
  font-size: 14px;
  font-weight: bold;
  margin-right: 5px;
}
.leave {
  padding: 15px;
}
.leave .message {
  color: #f56c6c;
  display: inline-block;
  line-height: 34px;
}
.leave .normal {
  color: #666;
  display: inline-block;
  line-height: 34px;
}
.leave-pointer {
  float: right;
}
.leave-pointer span {
  color: #13cb6e;
  margin-left: 20px;
  line-height: 34px;
  cursor: pointer;
}
.leave-pointer i {
  font-weight: bold;
  padding-right: 5px;
}
.leave-pointer .btn {
  height: 34px;
  line-height: 14px;
  padding: 8px;
  color: #fff;
  background-color: #13cb6e;
}
.change {
  display: inline-block;
  cursor: pointer;
  padding: 20px 20px 0;
}
.change i {
  color: #13cb6e;
  font-weight: bold;
  vertical-align: top;
}
.change:hover {
  color: #13cb6e;
}
.p-t-lg {
  padding: 30px 44px;
  border-top: 1px solid #eee;
}
header .title {
  display: inline-block;
  font-size: 18px;
}
header .is-open {
  float: right;
}
header .edit {
  float: right;
  color: #666;
  cursor: pointer;
}
.edit:hover {
  color: #13cb6e;
}
.edit i {
  vertical-align: bottom;
}
.main {
  margin-top: 30px;
}
.main > section {
  float: left;
  padding-bottom: 15px;
  width: 50%;
}
.main span {
  font-size: 14px;
  color: #999;
}
.main > section span:first-child {
  display: inline-block;
  width: 120px;
}
.warn {
  color: #f56c6c;
}
.main .value {
  padding-left: 5px;
  color: #666;
}
.family {
  padding: 10px 20px;
  background-color: #eee;
  border-radius: 3px;
}
.family .info {
  display: inline-block;
}
.info .f-name,
.word-address {
  color: #666 !important;
}
.info li {
  margin-bottom: 5px;
}
.info span {
  display: inline-block;
  margin-right: 20px;
}
.family .operation {
  float: right;
  text-align: right;
}
.operation > span {
  margin-left: 20px;
  display: inline-block;
  cursor: pointer;
}
.operation > span:hover {
  color: #13cb6e;
}
.img-bj {
  position: relative;
  width: 225px;
  height: 135px;
  border-radius: 4px;
  margin: 0 10px 10px 0;
  background-color: #eee;
}
.img-head {
  position: relative;
  width: 108px;
  height: 135px;
  border-radius: 4px;
  margin: 0 10px 10px 0;
  background-color: #eee;
}

.img-box p {
  color: #999;
  font-size: 12px;
}
.img-box {
  float: left;
  margin: 0 10px 10px 0;
}
.img-box .tip-head {
  color: #999;
  width: 108px;
  margin: 0 10px 10px 0;
}
.img-box .upBtn {
  margin-top: 10px;
  position: relative;
  width: 50px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  color: #fff;
  border-radius: 4px;
  cursor: pointer;
  background-color: #13cb6e;
}
.img-box .upBtn input {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
}
.explain {
  color: #999;
  margin-top: 10px;
}
.box {
  margin-right: 40px;
  margin-bottom: 20px;
}
.input-box {
  position: relative;
  float: left;
  width: 50%;
  margin-bottom: 22px;
}
.input-box .title,
.box .title {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  width: 113px;
  color: #666;
}
.tip {
  color: #f56c6c;
  font-size: 12px;
  padding-left: 120px;
  text-align: center;
  margin-bottom: 4px;
}
.input-box .value {
  display: inline-block;
  width: 228px;
}
.input-box p {
  padding-top: 4px;
  padding-left: 146px;
  font-size: 12px;
  color: #999;
}
.data-range {
  position: absolute;
  bottom: -18px;
  left: 146px;
  font-size: 12px;
  color: #f56c6c;
}
.button-box {
  clear: both;
  border-top: 1px solid #eee;
  padding: 30px;
}
.button-box > div {
  display: inline-block;
  min-width: 50px;
  padding: 8px 10px;
  border-radius: 3px;
  text-align: center;
  cursor: pointer;
}
.table {
  margin-top: 20px;
}
</style>
